<%@ include file="/common/taglibs.jsp"%>

<head>
    <title><fmt:message key="schoolDetail.title"/></title>
    <meta name="heading" content="<fmt:message key='schoolDetail.heading'/>"/>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true &amp;
    		key=ABQIAAAA_R0lkkol9hJbSmyBaFcLghTJQa0g3IQ9GZqIMmInSLzwtGDKaBQtQx5eXrRNDKtwDTGmDUG3yTfdgQ" 
			type="text/javascript">
	</script>
</head>
<s:form id="schoolForm" action="save" method="post" validate="true">
<s:hidden name="school.id" value="%{school.id}"/>

	<li>
		<s:textfield key="school.name" required="true" cssClass="text medium"/>
	</li>
    <li>
        <label class="desc"><fmt:message key="school.address.address"/></label>
        <div class="group">
            <div>
                <s:textfield key="school.address.address" theme="xhtml" cssClass="text large" labelposition="bottom"/>
            </div>
            <div class="left">
                <s:textfield key="school.address.city" theme="xhtml" required="true" cssClass="text medium" 
                    labelposition="bottom"/>
            </div>
            <div>
                <s:textfield key="school.address.province" theme="xhtml" required="true" cssClass="text state" 
                    labelposition="bottom"/>
            </div>
            <div class="left">
                <s:textfield key="school.address.postalCode" theme="xhtml" required="true" cssClass="text medium" 
                    labelposition="bottom"/>
            </div>
            <div>
                <s:set name="country" value="school.address.country" scope="page"/>
                <appfuse:country name="school.address.country" prompt="" default="${country}"/>
                <p>
                    <label for="school.address.country">
                        <fmt:message key="school.address.country"/> <span class="req">*</span>
                    </label>
                </p>
            </div>
        </div>
    </li>
    
    <input type="hidden" id="address" value="${school.address.address}"/> 
		<div id="map_canvas" style="width: 500px; height: 300px"></div>
       
	<li class="buttonBar bottom">
        <s:submit cssClass="button"  method="save" key="button.save"  theme="simple"/>
        <c:if test="${not empty school.id}">
            <s:submit cssClass="button" method="delete" key="button.delete" onclick="return confirmDelete('major')" theme="simple"/>
        </c:if>
        <s:submit cssClass="button" method="cancel" key="button.cancel" theme="simple"/>
    </li>

</s:form>
<script type="text/javascript">
    Form.focusFirstElement($("schoolForm"));
</script>

 <script type="text/javascript">

		var map = new GMap2(document.getElementById("map_canvas"));
		var geocoder = new GClientGeocoder();



		 function initialize() {
		 if (GBrowserIsCompatible()) {
		 var map = new GMap2(document.getElementById("map_canvas"),
		 { size: new GSize(640,320) } );
		 map.setCenter(new GLatLng(42.366662,-71.106262), 11);
		 var customUI = map.getDefaultUI();
		 // Remove MapType.G_HYBRID_MAP
		 customUI.maptypes.hybrid = false;
		 map.setUI(customUI);
		 }
		 }

		function showAddress(address) {
		  geocoder.getLatLng(
		    address,
		    function(point) {
		      if (!point) {
		        alert(address + "is not found!");
		      } else {
				 var customUI = map.getDefaultUI();
				 // Remove MapType.G_HYBRID_MAP
				 customUI.maptypes.hybrid = false;
				 map.setUI(customUI);
				map.setCenter(point, 13);
		        var marker = new GMarker(point);
		        map.addOverlay(marker);
				 marker.openInfoWindowHtml(address);
		      }
		    }
		  );
		}

		var address=document.getElementById("address").value;
		if(address!=null)
		   showAddress(address);
		</script>

